<template>
  <div class="full-page" style="background-color:#F2F3F4;">
    <div v-for="(item, index) in reviews" :key="index" class="card-item">
      <van-swipe-cell>
        <van-panel
          icon="comment-o"
          :title="item.remark"
          :desc="item.created_time"
        >
          <div style="height:7px;" />
          <van-rate
            style="padding:0 12px;"
            v-model="item.star"
            readonly
            :count="5"
            :size="20"
            color="#ee0a24"
            void-icon="star"
            void-color="#eee"
          />
          <div style="height:10px;" />
        </van-panel>

        <template slot="right">
          <van-button
            style="height:100%;"
            square
            type="danger"
            text="删除"
            @click="onCancelClick(item.review_id)"
          />
        </template>
      </van-swipe-cell>

      <div style="height:10px;background-color:#F2F3F4;" />
    </div>
  </div>
</template>
<script>
import { axios, API_URL } from "../../api"
import { SwipeCell, Rate, Card, Button, Field, Toast, Cell, Panel } from "vant"
export default {
  components: {
    [SwipeCell.name]: SwipeCell,
    [Cell.name]: Cell,
    [Rate.name]: Rate,
    [Card.name]: Card,
    [Button.name]: Button,
    [Field.name]: Field,
    [Panel.name]: Panel
  },
  data() {
    return {
      reviews: []
    }
  },
  methods: {
    onCancelClick(review_id) {
      axios
        .delete(API_URL + "review/" + review_id, {
          headers: { Authorization: this.$store.state.customer_token }
        })
        .then(() => {
          Toast("删除成功!")
          this.getReviews()
        })
        .catch(err => {
          console.error(err)
        })
    },
    /* 用户获得订单信息 */
    getReviews() {
      this.reviews = []
      axios
        .get(API_URL + "review/search", {
          params: { customer_id: this.$route.params.customer_id }
        })
        .then(response => {
          let review_ids = response.data.review_ids
          review_ids.forEach(review_id => {
            axios.get(API_URL + "review/" + review_id, {}).then(response => {
              let review = {}
              review.review_id = review_id
              review.remark = response.data.remark
              review.star = response.data.star
              review.created_time = response.data.created_time
              this.reviews.push(review)
            })
          })
        })
        .catch(err => {
          console.error(err)
        })
    }
  },
  mounted: function() {
    this.getReviews()
  }
}
</script>
